<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<c:set var="ctx" value="${pageContext.request.contextPath}" />
<!DOCTYPE html>
<html>

<head>
<meta charset="UTF-8">
<meta name="viewport"
	content="width=device-width, user-scalable=no, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<script
	src="http://webapi.amap.com/maps?v=1.3&amp;key=0861c3ca222363fe2bd8679d2050e445"></script>
<link rel="stylesheet" href="../css/base.css" />
<link rel="stylesheet" href="../css/index_five_az.css" />
<link rel="stylesheet" href="../css/imgpre.css" />
<script src="../js/jquery-1.8.3.js"></script>
<script src="../js/address.js"></script>
<script type="text/javascript" src="${ctx}/layui/layui.all.js"></script>
<link rel="stylesheet" type="text/css" href="${ctx}/layui/css/layui.css">
<script type="text/javascript" src="${ctx}/js/layui_common.js"></script>
<link rel="stylesheet" href="../css/gaimui/mui.css" />
<script src="../js/mui/mui.js"></script>
<script src="../js/imgpre.js"></script>
<script type="text/javascript" src="${ctx}/js/md5.js"></script>
<script>
	$(function() {
		//				var clientW =  document.documentElement.clientWidth;
		var clientW = $(window).width();
		var originW = 750;
		var bili = clientW / originW * 100 + "px";
		document.querySelector("html").style.fontSize = bili;
		var h = window.innerHeight;
		$("#container").css('height', h);
	})
</script>
<script type="text/javascript">
	function uploadImg(file) {
		var imgpath = "";
		var form = new FormData();
		form.append("imgfiles", file);
		$.ajax({
			url : '${ctx}/uploadfile/uploadFile',
			data : form,
			type : 'post',
			async : false,
			processData : false,
			contentType : false,
			cache : false,
			dataType : 'json',
			beforeSend : function() {
				layer.load(2);
			},
			success : function(data) {
				layer.closeAll("loading");
				imgpath = data.img;
			}
		});
		return imgpath;
	}
	function addRecord(password) {
		var i;
		var passwords=Base64.decode(password);
		layer.prompt({title: '请输入密码:', formType: 1}, function(pwd, index){
			if(pwd==passwords){
				var context = $("#textarea").val();
				var address = $("#weizhi").text();
				var username = $("#name").val();
				var type = $("#h2").text();
				var registrationid = $("#deviceid").val();
				var form = new FormData();
				form.append('context', context);
				form.append('address', address);
				form.append('username', username);
				form.append('type', type);
				form.append('registrationid', registrationid);
				form.append("imgurl", imgurl.substr(0, imgurl.length - 1));
				$.ajax({
					url : '${ctx}/registrationRecord/addRegistrationRecordInfo',
					data : form,
					type : 'post',
					processData : false,
					contentType : false,
					cache : false,
					dataType : 'html',
					beforeSend : function() {
						i = layer.open({
							type : 3,
							area : '500px',
							skin : 'layui-layer-molv',
							shade : 0.5,
							shadeClose : true,
							maxmin : true
						});
					},
					success : function(data) {
						layer.close(i);
						if (data == "success") {
							layer.alert("上传成功!",function() {
								window.location.href = "${ctx}/registration/getRegistration?id="+ ${deviceid.deviceid};
								parent.layer.close(index);
							});
						} else if (data == "nopass") {
							layer.alert("没有权限添加,请联系管理员!");
						} else if (data == "error") {
							layer.alert("添加异常,请联系管理员!");
						}
					}
				})
			}else if(password==null || password =="" || password == undefined){
				layer.alert("密码不能为空");
			}else{
				layer.alert("密码错误");
			}
		});
	}
</script>
</head>

<body>
	<div id="container">
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title font_color">
				<span id="h2">3</span>.维修记录
			</h1>
			<input id="deviceid" type="hidden" value="${deviceid.id }" />
		</header>

		<div class="mui-content">

			<ul class="mui-table-view delbef">
				<!-- <div id='image-list' class="row image-list"></div> -->
				<div class="up_img">
					<!--调用相册start-->
					<div class="img_div"></div>
					<a href="javascript:;" class="a-upload"> <input type="file"
						name="myFile" id="myFile" multiple="multiple" onclick="uploadImg();"/><img
						src="../images/照相机icon@2x.png" alt="" />
					</a>
					<div class="shade" onclick="javascript:closeShade()">
						<div class="">
							<span class="text_span"> </span>
						</div>
					</div>

					<div class="shadeImg" onclick="javascript:closeShadeImg()">
						<div class="">
							<img class="showImg" src="">
						</div>
					</div>
					<!--调用相册end-->
				</div>
				<div class="mui-input-row  duohang">
					<textarea class="shuru" id="textarea" rows="5"
						placeholder="请输入文本说明"></textarea>
				</div>
				<div class="dingwei">
					<div class="dingweifont">定位信息</div>
					<img class="dingweiimg" src="../images/铁路地点@2x.png" alt="" />
					<div class="dingweicent" id="weizhi"></div>
				</div>
				<div class="titles">请填写身份信息</div>
				<li class="listfour mui-table-view-cell listinput">
					<div class="mui-input-row">
						<label class="texhttp">您的姓名</label> <input class="texinput"
							type="text" id="name" placeholder="请输入">
					</div>
				</li>

			</ul>
			<div class="mui-content-padded">
				<button type="button" class="mui-btn mui-btn-block"
					onclick="addRecord('${map.password}');">上传</button>
			</div>
		</div>
	</div>
	<script>
		function getLocation() {
			if (navigator.geolocation) {
				navigator.geolocation.getCurrentPosition(showPosition);
			} else {
				x.innerHTML = "Geolocation is not supported by this browser.";
			}
		}
		//获取当前位置(方法名)
		mMap.getSessionLocation(locationFunc);

		function locationFunc() {
			var data = JSON.parse(sessionStorage.getItem("location"));
			//逆地理编码
			//				lng:+ " +0.04329"
			//				lat:+ "-0.01625"
			var lng = data.position.lng;
			var lat = data.position.lat;
			//万科广场
			//				var sjlng = lng - 0.01679;
			//				var sjlat = lat + 0.04419;
			//三江酒店
			var sjlng = lng + 0.01225;
			var sjlat = lat + 0.03923; 

			//文华街
			//				var sjlng = lng - 0.02332;
			//				var sjlat = lat + 0.04358;

			//				var lnglatXY = [data.position.lng , data.position.lat ]; //地图上所标点的坐标
			var lnglatXY = [ sjlng, sjlat ]; //地图上所标点的坐标

			geocoder.getAddress(lnglatXY, function(status, result) {
				if (status === 'complete' && result.info === 'OK') {
					//获得了有效的地址信息:
					//      alert(result.regeocode.formattedAddress);
					var ditu = result.regeocode.formattedAddress;
					$("#weizhi").html(ditu);
					//					$("#lng").html(data.position.lng);
					//					$("#lat").html(data.position.lat);
					console.log(data.position.lng);
					console.log(data.position.lat)
				} else {
					//获取地址失败
					alert("获取失败，请把手机定位打开");
				}
			});

		}
		//
		//  // 获取两点的距离 (m)
		//  function getDistance(){
		//    var obj1={lng:116.39,lat: 39.98};
		//    var obj2={lng:116.39,lat: 38.98};
		//    alert(mMap.distance(obj1,obj2));
		//    mMap.serverDistance(obj1,obj2);
		//  }
	</script>
</body>
<script>
	//		var myTextarea = document.getElementById('myTextarea').value;
</script>

</html>